<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>修改密码</title>
	<link rel="stylesheet" type="text/css" href="__CSS__/api.css"/>
	<link rel="stylesheet" type="text/css" href="__CSS__/aui.css"/>
	<style>
		body{
			background-color:#F8F8F8;
			/*padding-top:1.55rem;*/
		}
		.outer{
			padding-left:18.5px;
			padding-right:18.5px;
			height:45px;
			border-radius: 1px;
			width:100%;
		}
		input[type=tel],
		input[type=password],
		input[type=text] {
			background:#FFFFFF ;
			margin: 0;
			/*color: #fff;*/
			font-size: 14px;
			height:45px;
			padding-left:23.5px;
			border-radius:0.1px;
		}
		input::-webkit-input-placeholder {
			color:#B1B1B1;
			font-size: 14px;
		}
		.code{
			margin-top:15px;
			margin-bottom:15px;
			border-top-right-radius: 0;
			border-bottom-right-radius: 0;
		}
		.send{
			/*width:34%;*/
			background-color: #F04040;
			color:#FFFFFF;
			font-size: 14px;
			line-height:46px;
			height:45px;
			text-align:center;
			border-top-right-radius:1px;
			border-bottom-right-radius:1px;
			padding-left:21.5px;
			padding-right:21.5px;
			display:inline-block;
		}
		.pwd{
			padding-right:10px;
			content: '';
			width:40px;
			height:45px;
			background: url('__IMG__/yanjing2.png') no-repeat center center;
			background-size: 0.95rem;
			background-color:#ffffff;
		}

		.showImggg{
			padding-right:10px;
			content: '';
			width:40px;
			height:45px;
			background: url('__IMG__/yanjing.png') no-repeat center center;
			background-size: 0.95rem;
			background-color:#ffffff;
		}

		.register{
			height:47px;
			margin-top:55px;
			color:#FFFFFF;
			font-size:16px;
			background: linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
			border-radius: 4px;
			text-align:center;
			line-height:47px;
		}

	</style>
</head>
<body>
<style>
	.aui-bar-nav{
		background:linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
		color:#fff;
	}
	.aui-iconfont {
		position: relative;
		font-family: "aui_iconfont" !important;
		font-size: 0.7rem;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		height: 2.4rem;
	}

	.aui-icon-tu {
		height: 2.4rem;
		width: 49px;
		background: url('__IMG__/left1.png') no-repeat 0.5rem center;
		background-size: 10px 17.5px;
	}

	.aui-bar-nav .aui-pull-right {
		padding-right: 0.75rem;
	}

	.aui-bar-nav .aui-iconfont {
		position: relative;
		z-index: 20;
		font-size: 0.75rem;
		color: #2E82FF;
		line-height: 2.4rem;
	}
</style>
<header class="aui-bar aui-bar-nav underLine" style="margin-bottom:20px;">
	<a class="aui-pull-left" tapmode="active" onclick="window.history.back(-1);"> <span class="aui-iconfont aui-icon-tu"> </span> </a>
	<div class="aui-title">修改密码</div>
	<!-- <a class="aui-pull-right">
               <span class="aui-iconfont" tapmode="active" onclick="right()">完成</span>
       </a>-->
</header>
<div class="outer">
	<input type="tel" placeholder="请输入您绑定的手机号" maxlength="11" id="user_name"/>
</div>
<div class="outer code flex-wrap">
	<input class='flex-con' type="tel"  placeholder="请输入验证码"  id='codeValue' maxlength="6" placeholder="请输入验证码"/>
	<span class="send" id='code' onclick="need_ma()" tapmode="active">获取验证码</span>
</div>
<div class="outer flex-wrap">
	<div class="flex-con">
		<input type="password"  placeholder="请设置您的登录密码" minlength="6" maxlength="20"  id='user_pwd'/></div>
	<div class="showImggg" id="new_pwd" onclick="yanjing(this)" tapmode="active"></div>
</div>
<div class="outer">
	<div class="register" onclick="toRegister()" tapmode="active">确认</div>
</div>

</body>
<script type="text/javascript" src="__JS__/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/api.js"></script>
<script type="text/javascript" src="__JS__/tt.js"></script>
<script type="text/javascript">

    // 验证码获取
    var isOnclick=true;
    var yzm = true;
    function need_ma(){
        var user_name = $('#user_name').val();
        var regBox = {
            regMobile: /^\d{11}$/ //手机
        }
        var rPhone = regBox.regMobile.test(user_name);
        if (!(rPhone&&user_name)) {
            alert('请输入正确手机号');
            return;
        }
        if(isOnclick && yzm){
            yzm = false;
            //生成六位验证码
            // var code4 = randomNmuber(0, 6);
            //调用接口判断
            sendSMS(user_name);
        }else{
            alert('请稍等');
            return;
        }
    }

    function sendSMS(phone){
        $.ajax({
            url: '{:url("Login/getPhoneCode")}',
            data: 'phone=' + phone + '&type=3' + '&reset=1',//
            type: 'POST',
            dataType: 'JSON',
            success: function (data) {
                if (data.status == '200') {
                    if (isOnclick) {
                        times = 59;
                        isinerval = setInterval("CountDown()", 1000);
                        isOnclick = false;
                    }
                } else {
                    alert(data.msg)
                }
            },
            error: function () {
                alert('Ajax error!');
            }
        })
    }
    //验证码60秒倒数
    function CountDown() {
        var code = $('#code');
        if (times < 1) {
            $('#code').html('重新获取');
            clearInterval(isinerval);
            isOnclick=true;
            return;
        }
        $('#code').html('' + times + 's后重发');
        times--;
    }

    //修改密码

    function toRegister(){
        var user_name = $('#user_name').val();
        var code = $('#codeValue').val();
        var user_pwd = $('#user_pwd').val();

        var regBox = {
            regMobile: /^\d{11}$/ //手机
        }

        var regBox1 = {
            regUpwd: /^[\da-zA-Z]{6,20}$/ //密码6-20位英文或数字
        }

        var rPhone = regBox.regMobile.test(user_name);
        var rPwd = regBox1.regUpwd.test(user_pwd);

        if (!(rPhone&&user_name)) {

            alert('请输入正确手机号');

            return;

        }else if(code==''){
            alert('请输入验证码');

            return;
        }else if(!rPwd){

            alert('请输入6-20位英文或数字');

            return;

        }else{
            $.ajax({
                url: '{:url("Login/forgetPass")}',
                data: 'phone=' + user_name + '&code=' + MD5(code) + '&newpass=' + user_pwd,//
                type: 'POST',
                dataType: 'JSON',
                success: function (data) {
                    if (data.status == 200) {
                        window.history.back(-1);
                    } else {
                        alert(data.msg)
                    }
                },
                error: function () {
                    alert('Ajax error!');
                }
            })
        }
    }
    // 显示隐藏密码
    function yanjing(el) {
        var user_pwd = $('#user_pwd').val();
        if ($(el).hasClass('pwd')) {
            $(el).removeClass('pwd');
            $(el).addClass('showImggg');
            document.getElementById("user_pwd").type="password";
        } else {
            $(el).removeClass('showImggg');
            $(el).addClass('pwd');
            document.getElementById("user_pwd").type="text";
        }
    }

</script>
</html>
